<?xml version="1.0" encoding="UTF-8"?><d:tdl xmlns="http://www.w3.org/1999/xhtml" xmlns:b="http://www.backbase.com/2006/btl"  xmlns:d="http://www.backbase.com/2006/tdl" >

	<d:namespace name="http://www.backbase.com/2006/btl">

	<!--
	TODO:
		- addItem should return item as in super element
	-->

		<d:uses element="taskBarBase taskBarItemBase" src="../taskBarBase.xml"/>

		<d:resource type="text/css"><![CDATA[.btl-taskBar {
	cursor: default;
	background-color: #EAECEE;
}
.btl-taskBar-ul {
	padding: 0;
	margin: 0;
	list-style: none;
}
.btl-windowArea .btl-taskBar {
	position: absolute;
}
.btl-taskBar-horizontal {
	width: 100%;
	left: 0;
	background-repeat: repeat-x;
	background-position: left top;
}
.btl-taskBar-top {
	top: 0;
	padding-top: 1px;
	padding-bottom: 1px;
}
.btl-taskBar-bottom {
	bottom: 0;
	padding-top: 1px;
	padding-bottom: 1px;
}
.btl-taskBar-vertical {
	width: 120px;
	height: 100%;
	top: 0;
	background-position: left top;
	background-repeat: repeat-y;
	border-style: none;
}
.btl-taskBar-left {
	left: 0;
	padding-right: 1px;
	padding-left: 2px;
}
.btl-taskBar-right {
	right: 0;
	padding-right: 2px;
	padding-left: 1px;
}
/* element to push the height of the taskBar if there is no content */
.btl-taskBar-horizontal .btl-taskBarHeight {
	float: left;
	width: 1px;
	overflow: hidden;
}
.btl-taskBarHeight .btl-label {
	padding: 4px;
}
.btl-taskBar-vertical .btl-taskBarHeight {
	display: none;
}
.btl-taskBarItem {
	float: left;
	margin: 0 1px;
	overflow: hidden;
	cursor: pointer;
}
.btl-taskBar-clear {
	clear: both;
}
.btl-taskBar-vertical .btl-taskBarItem {
	float: none;
	margin: 0 0 1px 0;
}
.btl-taskBarItem .btl-label {
	padding: 2px 4px;
}
.btl-taskBarItem-top-left,
.btl-taskBarItem-middle-left,
.btl-taskBarItem-bottom-left {
	padding-left: 2px;
}
.btl-taskBarItem-top-right,
.btl-taskBarItem-middle-right,
.btl-taskBarItem-bottom-right {
	padding-right: 2px;
}
.btl-taskBarItem-middle-left,
.btl-taskBarItem-middle-right {
	background-repeat: repeat-y;
}
.btl-taskBarItem-top-left,
.btl-taskBarItem-bottom-left,
.btl-taskBarItem-top-right,
.btl-taskBarItem-bottom-right {
	background-repeat: no-repeat;
}
.btl-taskBarItem-top,
.btl-taskBarItem-bottom {
	height: 2px;
	background-repeat: repeat-x;
}
.btl-taskBarItem-top-left {
	background-image: url(media/taskBarItemTopLeft.png);
	background-position: left top;
}
.btl-taskBarItem-top-right {
	background-image: url(media/taskBarItemTopRight.png);
	background-position: right top;
}
.btl-taskBarItem-top	 {
	background-image: url(media/taskBarItemTop.png);
	background-position: left top;
}
.btl-taskBarItem-middle-left {
	background-image: url(media/taskBarItemLeft.png);
	background-position: left top;
}
.btl-taskBarItem-middle-right {
	background-image: url(media/taskBarItemRight.png);
	background-position: right top;
}
.btl-taskBarItem-middle {
	background-image: url(media/taskBarItemBackground.png);
	background-position: left top;
	background-repeat: repeat-x;
	background-color: #E8EAEC;
	overflow: hidden;
}
.btl-taskBarItem-bottom-left {
	background-image: url(media/taskBarItemBottomLeft.png);
	background-position: left bottom;
}
.btl-taskBarItem-bottom-right {
	background-image: url(media/taskBarItemBottomRight.png);
	background-position: right bottom;
}
.btl-taskBarItem-bottom {
	background-image: url(media/taskBarItemBottom.png);
	background-position: left bottom;
}
.btl-taskBarItem-text {
	white-space: nowrap;
	text-overflow: ellipsis;
}
.btl-taskBarItem-hover .btl-taskBarItem-middle,
.btl-taskBarItem-press .btl-taskBarItem-middle,
.btl-taskBarItem-active .btl-taskBarItem-middle,
.btl-taskBarItem-active-hover .btl-taskBarItem-middle {
	border-style: solid;
	border-width: 1px;
}
.btl-taskBarItem-hover .btl-label,
.btl-taskBarItem-active-hover .btl-label {
	padding: 1px 3px;
}
.btl-taskBarItem-active .btl-label,
.btl-taskBarItem-press .btl-label {
	padding: 2px 2px 0 4px;
}
.btl-taskBarItem-active .btl-taskBarItem-text {
	font-weight: bold;
}
/* hides minimized windows in the connected windowArea */
.btl-windowArea-with-taskBar .btl-window-minimized {
	display: none;
}
/* allows default behavior when a window is nested inside another window */
.btl-windowArea-with-taskBar .btl-window .btl-window-minimized {
	display: block;
}
/* fixes */
.btl-taskBar,
.btl-taskBar * {
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-khtml-box-sizing: border-box;
}
.btl-taskBar {
	z-index: 10000;
}
.ie .btl-taskBarItem-top-left,
.ie .btl-taskBarItem-top-right,
.ie .btl-taskBarItem-top,
.ie .btl-taskBarItem-bottom-left,
.ie .btl-taskBarItem-bottom-right,
.ie .btl-taskBarItem-bottom {
	font-size: 0;
	line-height: 0;
	overflow: hidden;
}
.ie .btl-taskBarItem-middle-left {
	 /* the element did not fully push the bottom part of the taskBarItem down, resulting in
	 a visual artifact */
	zoom: 1.0;
}
.ie .btl-taskBar-vertical .btl-taskBarItem {
	margin-bottom: -2px;
	zoom: 1.0;
}
.ie .btl-taskBarItem-text {
	overflow: hidden;
	width: 100%;
}]]></d:resource>
		<d:resource type="text/javascript"><![CDATA[btl.taskBar = {};

btl.taskBar.updatePosition = function btl_taskBar_updatePosition(oController){
	if(!oController._._windowArea){
		return;
	}

	var sOrientation = oController.getProperty('orientation');

	switch(sOrientation){
		case 'top':
			bb.html.replaceClass(oController.viewNode, ['btl-taskBar-vertical', 'btl-taskBar-left', 'btl-taskBar-right', 'btl-taskBar-bottom'], ['btl-taskBar-horizontal', 'btl-taskBar-top']);
			break;
		case 'right':
			bb.html.replaceClass(oController.viewNode, ['btl-taskBar-horizontal', 'btl-taskBar-top', 'btl-taskBar-bottom', 'btl-taskBar-left'], ['btl-taskBar-vertical', 'btl-taskBar-right']);
			break;
		case 'bottom':
			bb.html.replaceClass(oController.viewNode, ['btl-taskBar-vertical', 'btl-taskBar-left', 'btl-taskBar-right', 'btl-taskBar-top'], ['btl-taskBar-horizontal', 'btl-taskBar-bottom']);
			break;
		case 'left':
			bb.html.replaceClass(oController.viewNode, ['btl-taskBar-horizontal', 'btl-taskBar-top', 'btl-taskBar-bottom', 'btl-taskBar-right'], ['btl-taskBar-vertical', 'btl-taskBar-left']);
			break;
		case 'vertical':
			bb.html.replaceClass(oController.viewNode, ['btl-taskBar-horizontal', 'btl-taskBar-left', 'btl-taskBar-right', 'btl-taskBar-top', 'btl-taskBar-bottom'], 'btl-taskBar-vertical');
			break;
		case 'horizontal':
		default:
			bb.html.replaceClass(oController.viewNode, ['btl-taskBar-vertical', 'btl-taskBar-left', 'btl-taskBar-right', 'btl-taskBar-top', 'btl-taskBar-bottom'], 'btl-taskBar-horizontal');
			break;

	}
	this.updateWidth(oController);
};

btl.taskBar.updateWidth = function (oController){
	var aItems = oController.getProperty('items');
	var sSize = 'auto';
	var iItems = aItems.length;

	var sOrientation = oController.getProperty('orientation');

	if(sOrientation === 'top' || sOrientation === 'bottom' || sOrientation === 'horizontal' ){
		// width with small correction
		var iWidth = bb.html.getBoxObject(oController.viewNode).width - (iItems * 2 + 5); /* adjustment for margin between elements and extra random adjustment */
		var iNewWidth = 150;
		sSize = iNewWidth;

		if(iItems * iNewWidth > iWidth){
			sSize = iWidth / iItems;
		}
	}

	for(var i = iItems - 1; i >= 0; i--){
		if(sSize !== 'auto'){
			btl.html.setWidth(aItems[i].viewNode, sSize);
		} else {
			aItems[i].viewNode.style.width = 'auto';
		}
	}
};]]></d:resource>
		<d:resource type="image/png" src="media/taskBarItemTopLeft.png"/>
		<d:resource type="image/png" src="media/taskBarItemTop.png"/>
		<d:resource type="image/png" src="media/taskBarItemTopRight.png"/>
		<d:resource type="image/png" src="media/taskBarItemLeft.png"/>
		<d:resource type="image/png" src="media/taskBarItemBackground.png"/>
		<d:resource type="image/png" src="media/taskBarItemRight.png"/>
		<d:resource type="image/png" src="media/taskBarItemBottomLeft.png"/>
		<d:resource type="image/png" src="media/taskBarItemBottom.png"/>
		<d:resource type="image/png" src="media/taskBarItemBottomRight.png"/>

		<d:element name="taskBar" extends="b:taskBarBase">
			

			<d:template type="application/xhtml+xml">
				<div class="btl-taskBar btl-bevel-top-bottom">
					<div class="btl-taskBarHeight"><div class="btl-label"> </div></div>
					<ul class="btl-taskBar-ul">
						<d:content/>
					</ul>
					<div class="btl-taskBar-clear"/>
				</div>
			</d:template>

			<d:attribute name="orientation">
				<d:changer type="text/javascript"><![CDATA[
					btl.taskBar.updatePosition(this);
					btl.taskBar.updateWidth(this);
				]]></d:changer>
			</d:attribute>

			<d:property name="orientation">
				
				<d:setter type="text/javascript"><![CDATA[
					this.setAttribute(name, value);
				]]></d:setter>
				<d:getter type="text/javascript"><![CDATA[
					var sPos = this.getAttribute('orientation');
					var bInside = ( this._['_windowArea'] == this.getProperty('parentNode'));

					if( !bInside && sPos != 'vertical') // in this case taskBar position can't be left, top, right, bottom
						sPos = 'horizontal';
					else if(bInside && sPos == 'horizontal')
						sPos = 'bottom';
					else if(bInside && sPos == 'vertical')
						sPos = 'right';
					return sPos;
				]]></d:getter>
			</d:property>

			<d:method name="paint">
				<d:body type="text/javascript"><![CDATA[
					btl.taskBar.updatePosition(this);
				]]></d:body>
			</d:method>

			<d:method name="createItem">
				<d:body type="text/javascript"><![CDATA[
					return bb.document.createElementNS( btl.namespaceURI, 'taskBarItem');
				]]></d:body>
			</d:method>

			<d:method name="addItem">
				<d:argument name="window"/>
				<d:body type="text/javascript"><![CDATA[
					var oItem = this.callSuper('addItem', [window]);
					this.viewGate.appendChild(oItem.viewNode);
					btl.taskBar.updateWidth(this);
				]]></d:body>
			</d:method>

			<d:method name="removeItem">
				<d:argument name="item"/>
				<d:body type="text/javascript"><![CDATA[
					if (item) {
						this.viewGate.removeChild(item.viewNode);
						this.callSuper('removeItem', [item]);
					}
					btl.taskBar.updateWidth( this);
				]]></d:body>
			</d:method>

			<d:method name="init">
				<d:body type="text/javascript"><![CDATA[
					this.callSuper('init');
					var oWindowArea = this.getProperty('windowArea');
					if (oWindowArea) {
						bb.html.addClass(oWindowArea.viewNode, 'btl-windowArea-with-taskBar');
					}
				]]></d:body>
			</d:method>

			<d:method name="clear">
				
				<d:body type="text/javascript"><![CDATA[
					this.callSuper('clear');
					var oWindowArea = this.getProperty('windowArea');
					if (oWindowArea) {
						bb.html.removeClass(oWindowArea.viewNode, 'btl-windowArea-with-taskBar');
					}
				]]></d:body>
			</d:method>

			<d:constructor type="text/javascript"><![CDATA[
				this.__items = [];
			]]></d:constructor>

			<d:handler event="construct" type="text/javascript"><![CDATA[
				bb.ui.reflow.add(this);
			]]></d:handler>

			<d:handler event="reflow" type="text/javascript"><![CDATA[
				btl.taskBar.updateWidth(this);
			]]></d:handler>
		</d:element>

		<d:element name="taskBarItem" extends="b:taskBarItemBase">
			<d:template type="application/xhtml+xml">
				<li class="btl-taskBarItem">
					<div class="btl-taskBarItem-top-left">
						<div class="btl-taskBarItem-top-right">
							<div class="btl-taskBarItem-top"/>
						</div>
					</div>
					<div class="btl-taskBarItem-middle-left">
						<div class="btl-taskBarItem-middle-right">
							<div class="btl-taskBarItem-middle btl-label">
								<span class="btl-taskBarItem-text">
									<d:content/>
								</span>
							</div>
						</div>
					</div>
					<div class="btl-taskBarItem-bottom-left">
						<div class="btl-taskBarItem-bottom-right">
							<div class="btl-taskBarItem-bottom"/>
						</div>
					</div>
				</li>
			</d:template>

			<d:property name="name">
				<d:setter type="text/javascript"><![CDATA[
					this.appendChild( bb.document.createTextNode(value));
					this.viewNode.title = value;
					this._['_name'] = value;
				]]></d:setter>
			</d:property>

			<d:method name="updateWindow">
				<d:body type="text/javascript"><![CDATA[
					if( this._['_window'].getProperty('minimized')){
						if( this._['_active']){
							var oItem = this._['_previousActive'];
							oItem = (oItem && oItem._) ? oItem : this._['_previousActive'] = null;
							this.getProperty('parentNode').setProperty('activeItem',
								(oItem && (oItem._._window.getProperty('minimized') || oItem._._removed)) ? null : oItem);
						}
					}
				]]></d:body>
			</d:method>

			<d:method name="setActive">
				<d:argument name="active"/>
				<d:body type="text/javascript"><![CDATA[
					var oDiv = bb.selector.query(this.viewNode, 'div.btl-taskBarItem-middle');

					if(active) {
						bb.html.addClass(oDiv, 'btl-chameleon-activeBorder');
						bb.html.addClass(this.viewNode, 'btl-taskBarItem-active');
						bb.html.removeClass(this._['_window'].viewNode, 'btl-taskBar-window-hidden');
					} else {
						bb.html.removeClass(this.viewNode, 'btl-taskBarItem-active');
						bb.html.removeClass(oDiv, 'btl-chameleon-activeBorder');
					}

					this.callSuper( 'setActive', [active]);
				]]></d:body>
			</d:method>

			<d:handler type="text/javascript" event="click"><![CDATA[
				if( this._['_active'] && event.button == 0) //minimize window
					this._['_window'].setProperty('minimized', true);
				else
					this.setProperty('active', true);
			]]></d:handler>

			<d:handler event="contextmenu" type="text/javascript"><![CDATA[
				event.preventDefault();
				event.stopPropagation();
				var eEvent = bb.document.createEvent('Events');
				eEvent.initEvent('contextmenu', true, true);
				eEvent.viewTarget = this._['_window'].__windowHead;
				eEvent.clientX = event.clientX;
				eEvent.clientY = event.clientY;
				this._['_window'].dispatchEvent(eEvent);
			]]></d:handler>

			<d:handler event="mouseenter" type="text/javascript"><![CDATA[
				var oDiv = bb.selector.query(this.viewNode, 'div.btl-taskBarItem-middle');
				bb.html.addClass(oDiv, 'btl-chameleon-highlightBorder');

				if(this.getProperty('active')){
					bb.html.addClass(this.viewNode, 'btl-taskBarItem-active-hover');
				} else {
					bb.html.addClass(this.viewNode, 'btl-taskBarItem-hover');
				}
			]]></d:handler>

			<d:handler event="mousedown" type="text/javascript"><![CDATA[
				var oDiv = bb.selector.query(this.viewNode, 'div.btl-taskBarItem-middle');
				bb.html.addClass(oDiv, 'btl-chameleon-activeBorder');
				bb.html.addClass(this.viewNode, 'btl-taskBarItem-press');
			]]></d:handler>

			<d:handler event="mouseup" type="text/javascript"><![CDATA[
				var oDiv = bb.selector.query(this.viewNode, 'div.btl-taskBarItem-middle');
				bb.html.removeClass(oDiv, 'btl-chameleon-activeBorder');
				bb.html.removeClass(this.viewNode, 'btl-taskBarItem-press');
			]]></d:handler>

			<d:handler event="mouseleave" type="text/javascript"><![CDATA[
				var oDiv = bb.selector.query(this.viewNode, 'div.btl-taskBarItem-middle');
				bb.html.removeClass(oDiv, 'btl-chameleon-highlightBorder');
				if(!this.getProperty('active')){
					bb.html.removeClass(oDiv, 'btl-chameleon-activeBorder');
				}
				bb.html.removeClass(this.viewNode, ['btl-taskBarItem-hover', 'btl-taskBarItem-active-hover']);
			]]></d:handler>
		</d:element>
	</d:namespace>
</d:tdl>